<!--
 * @Description: 
 * @Author: chenjiaxin
 * @Date: 2022-09-03 16:04:36
 * @LastEditTime: 2022-09-04 10:46:20
 * @FilePath: \vue-ts-vite\src\views\home\index.vue
-->
<template>
  <div class="home">
    <button @click="btnClick">获取helloworld组件属性</button>
    <button @click="getValue">获取provide</button>
    <button @click="refreshBtn">刷新</button>
    <button @click="logHandle">输出</button>
    <button @click="logVersion">输出version</button>
    <button @click="copyBtn">拷贝</button>
    <hello-world ref="helloWorldRef" msg="标题"></hello-world>
    <h2>图标svg</h2>
    <svg-icon icon="vue" height="33px" width="33px"></svg-icon>
    <svg-icon icon="person" height="33px" width="33px"></svg-icon>
    <svg-icon icon="fasong" height="33px" width="33px"></svg-icon>
  </div>
</template>

<script lang="ts" setup>
import { ref, onBeforeMount, inject } from "vue";
import _ from "loadsh";
import { useRouter } from "vue-router";
import SvgIcon from "@/components/svg-icon";
import HelloWorld from "../../components/HelloWorld.vue";
import Loading from "../../components/loading/index";
import type { IAppProvoidKey } from "@/types";
import versionInfo from "@/global/version";

const router = useRouter();
// const foo = inject("foo");
const appMsg = inject<IAppProvoidKey>("msgKey");
const helloWorldRef = ref<InstanceType<typeof HelloWorld>>();

const btnClick = () => {
  console.log(helloWorldRef.value?.count);
  const loadingInstance = Loading.open();
  setTimeout(() => {
    loadingInstance.close();
  }, 2000);
};

const getValue = () => {
  console.log(appMsg);
  // refreshFn
};

const refreshBtn = () => {
  // 刷新页面的方法
  // 1. 强制刷新浏览器
  // location.reload();
  // 2. router.go()
  // router.go(0);
  // 3. provoid/reject
  appMsg?.refreshFn?.();
};

function makeIterator(array: any[]) {
  var nextIndex = 0;
  return {
    next: function () {
      return nextIndex < array.length
        ? { value: array[nextIndex++], done: false }
        : { value: undefined, done: true };
    },
  };
}
const it = makeIterator(["a", "b"]);
// console.log("===输出===", it.next());

const logHandle = () => {
  console.log("===输出===", it.next());
};

function logVersion() {
  console.log("===版本输出====", versionInfo.version);
}

function copyBtn() {
  const obj = {
    name: "AAA",
    hobby: ["学习", "敲代码", "打球"],
    attr: {
      color: true,
      data: {
        age: 18,
      },
      has: null,
      active: undefined,
    },
    fun: function () {
      console.log("fun");
    },
  };
  // obj.info = obj;
  const copyObj = _.cloneDeep(obj);
  console.log(obj, copyObj);
}
</script>

<style scoped lang="less"></style>
